<template>
  <div>
     <el-tag v-for="(item,index) in historyAry" 
     :key="index" 
     :closable="index!=0?true:false" @close="closeTags(index)"
     @click="selectTags(index)"
     :effect="curIndex==index?'dark':'light'">
        <router-link :to="item.path">{{item.meta.name}}</router-link>
     </el-tag>
  </div>
</template>

<script>
export default {
  data(){
    return{
      curIndex:0
    }
  },
  props:{
    historyAry:{
      type:Array,
      default:()=>[]
    }
  },
  methods:{
    closeTags(index){
       //$emit(参数1,参数2)
       //参数1：自定义事件的名称,参数2：是传递的值
       this.$emit('closeTagEvent',index)
       this.curIndex=this.historyAry.length-1

    },
    selectTags(index){
      this.curIndex=index
    }
  }
}
</script>

<style>

</style>